<template>
  <div>
    <div class="header-hr"></div>
    <div class="header">
      <div class="h-center">
        <div class="hc-left">
          <a :href="config.domain" class="hcl-logo">
            <img src="https://ys-cc.oss-cn-chengdu.aliyuncs.com/upload/20221116/95b8b68307394cc082d9cc682fa9fa60.png" alt style="width: 100%;">
          </a>
          <div class="hcl-title">纺扬网站建设|科技公司专注网站建设，网站优化、seo关键词排名<br>
            巨量引擎抖音代运营，信息流广告投放，竞价托管，<br>
            您值得信赖
          </div>
        </div>
        <div class="hc-right">
          <div class="hcr-search">
            <input type="text" class="s-input" v-model="search" @input="searchInput" placeholder="请输入案例名称">
            <a :href="searchHref" class="s-button"></a>
          </div>
          <div class="hcr-phone">
            <i class="p-icon"></i>
            <p class="p-num">191-0267-1826</p>
          </div>
        </div>
      </div> 
    </div>
  </div>
</template>

<script>
export default {
  props: ['config'],
  data() {
    return {
      search: '',
      searchHref: `${this.config.domain}/khal/`
    }
  },
  mounted() {
    this.search = location.search ? decodeURI(location.search.split('?keyword=')[1]) : ''
  },
  methods: {
    // 搜索案例名称
    searchInput(e) {
      this.searchHref =  `${this.config.domain}/khal/`
      if (this.search) {
        this.searchHref =  `${this.config.domain}/khal/?keyword=${this.search}`
      }
    }
  }
}
</script>